// eslint-disable-next-line no-unused-vars
import VXETable, { Column } from 'vxe-table'
import createBem from '@Components/assets/js/utils/bem'
import { tableNamespace } from '../../../config'
import { handlePropsMethod } from '../../../utils'

const Bem = createBem(`${tableNamespace}__switch`)

VXETable.renderer.add('Switch', {
  renderDefault(h, renderOpts, params) {
    const { row, column } = params
    const { events = {}, options = {} } = renderOpts
    const { onChange } = events

    const _options = handlePropsMethod(options, params, ['disabled'])

    function handleChange(cellValue) {
      onChange?.({ cellValue, row, column })
    }
    return [
      <div class={Bem()}>
        <el-switch
          v-model={row[column.property]}
          onChange={handleChange}
          props={_options}
        />
      </div>
    ]
  }
})

/** @type { Column } */
export const options = {
  showOverflow: 'ellipsis',
  align: 'center'
}
